<template>
    <div class="detail">
        <van-grid :column-num="5">
        <!-- <van-grid-item><img src="/tupian/妇科.png" alt="">妇科</van-grid-item>
        <van-grid-item><img src="/tupian/儿科.png" alt="" @click="keshi">儿科</van-grid-item>
        <van-grid-item><img src="/tupian/待评价.png" alt="">皮肤科</van-grid-item>
        <van-grid-item><img src="/tupian/妇产科.png" alt="">妇产科</van-grid-item>
        <van-grid-item><img src="/tupian/精神心理科.png" alt="">精神心理科</van-grid-item>
        <van-grid-item><img src="/tupian/口腔科.png" alt="">口腔科</van-grid-item>
        <van-grid-item><img src="/tupian/男科.png" alt="">男科</van-grid-item>
        <van-grid-item><img src="/tupian/内科.png" alt="">内科</van-grid-item>
        <van-grid-item><img src="/tupian/外科.png" alt="">外科</van-grid-item>
        <van-grid-item><img src="/tupian/眼科.png" alt="">眼科</van-grid-item>
        <van-grid-item><img src="/tupian/眼科.png" alt="">眼科</van-grid-item>
        <van-grid-item><img src="/tupian/眼科.png" alt="">眼科</van-grid-item>
        <van-grid-item><img src="/tupian/眼科.png" alt="">眼科</van-grid-item>
        <van-grid-item><img src="/tupian/眼科.png" alt="">眼科</van-grid-item>
        <van-grid-item><img src="/tupian/营养科.png" alt="">营养科</van-grid-item>
        <van-grid-item><img src="/tupian/中医.png" alt="">中医</van-grid-item>
        <van-grid-item><img src="/tupian/肿瘤科.png" alt="">肿瘤科</van-grid-item> -->
         <van-grid-item v-for="(v,i) in sectionList" :key="i" @click="keshi(v.text)">
            <svg class="icon" aria-hidden="true">
                <use :xlink:href="v.icon"/>
            </svg>
            <span class="text">{{v.text}}</span>
         </van-grid-item>
        </van-grid>
    </div>
</template>

<script>
export default {
    name:'detail',
    data(){
        return {
            sectionList: [
                {
                    icon: '#icon-meirongke',
                    text: '整形科'
                }, {
                    icon: '#icon-chuanranke',
                    text: '麻醉科'
                }, {
                    icon: '#icon-yingyangke',
                    text: '营养科'
                }, {
                    icon: '#icon-yanke',
                    text: '眼科'
                }, {
                    icon: '#icon-huayanke',
                    text: '化验科'
                }, {
                    icon: '#icon-pifuke',
                    text: '皮肤科'
                }, {
                    icon: '#icon-zhongyike',
                    text: '中医科'
                }, {
                    icon: '#icon-shengzhike',
                    text: '生殖科'
                }, {
                    icon: '#icon-waike',
                    text: '外科'
                }, {
                    icon: '#icon-neike',
                    text: '内科'
                }, {
                    icon: '#icon-miniaoke',
                    text: '泌尿科'
                }, {
                    icon: '#icon-fuke',
                    text: '妇科'
                }, {
                    icon: '#icon-erke',
                    text: '儿科'
                }, {
                    icon: '#icon-zhongliuke',
                    text: '肿瘤科'
                }, {
                    icon: '#icon-naoke',
                    text: '脑科'
                }, {
                    icon: '#icon-neifenmike',
                    text: '内分泌科'
                }, {
                    icon: '#icon-guke',
                    text: '骨科'
                }, {
                    icon: '#icon-erbihouke',
                    text: '耳鼻喉科'
                }, {
                    icon: '#icon-nanke',
                    text: '男科'
                }, {
                    icon: '#icon-kouqiangke',
                    text: '口腔科'
                }, {
                    icon: '#icon-binglike',
                    text: '病理科'
                }, {
                    icon: '#icon-yingxiangke',
                    text: '影像科'
                }, {
                    icon: '#icon-chuanranke1',
                    text: '传染科'
                }, {
                    icon: '#icon-kangfuke',
                    text: '康复科'
                }
            ],
        }
    },
    methods: {
        keshi(text){
            this.$router.push('/home/details/'+text)
        }
    },
}
</script>

<style lang="scss">
.van-grid-item {
    .icon {
        // font-size: 12px;
        width: 25px;
        height: 25px;
    }
    span.text {
        font-size: 14px;
        color: #818181;
        padding-top: 0.18rem;
    }
}
</style>